<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>支付页面</title>
    <!-- 引入jquery -->
    <script type="text/javascript" src="../js/jquery.min.js"></script>

    <!-- 引入 css  -->
    <!-- 引入bootstrap的css -->
    <link  href="../js/bootstrap3/css/bootstrap.css" rel="stylesheet" >
    <!-- 引入bootstrap-treeview的css -->
    <link rel="stylesheet" href="../js/bootstrap-treeview/bootstrap-treeview.min.css">
    <!-- 引入bootstrap-addTabs的css -->
    <link  href="../js/bootStrap-addTabs/bootstrap.addtabs.css" rel="stylesheet" >
    <!-- 引入bootstrap-table的css -->
    <link  href="../js/bootstrap-table/bootstrap-table.min.css" rel="stylesheet" >


    <!-- 引入 js  -->
    <!-- 引入bootstrap的js-->
    <script type="text/javascript" src="../js/bootstrap3/js/bootstrap.js"></script>
    <!-- 引入bootstrap-treeview的js-->
    <script type="text/javascript" src="../js/bootstrap-treeview/bootstrap-treeview.min.js"></script>
    <!-- 引入bootstrap-addTabs的js-->
    <script type="text/javascript" src="../js/bootStrap-addTabs/bootstrap.addtabs.js"></script>
    <!-- 引入bootstrap-table的js-->
    <script type="text/javascript" src="../js/bootstrap-table/bootstrap-table.min.js"></script>
    <script type="text/javascript" src="../js/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
    <!-- 引入bootbox.js -->
    <script type="text/javascript" src="../js/bootstrap-bootbox/bootbox.js"></script>
    <!-- 引入fileinput的js -->
    <script type="text/javascript" src="../js/bootstrap-fileinput/js/fileinput.min.js"></script>
    <!--  引入fileinput的js -->
    <script type="text/javascript" src="../js/bootstrap-fileinput/js/locales/zh.js"></script>
    <script type="text/javascript" src="../js/bootstrap-fileinput/themes/fa/theme.js"></script>

    <link rel="stylesheet" href="../dingdan/order.css">
    <link rel="stylesheet" href="../dingdan/footer.css">
    <script src="../dingdan/jsAddress.js"></script>
</head>
<script type="text/javascript">

    $(document).ready(function(){

        addressInit('cmbProvince', 'cmbCity', 'cmbArea');

    });

</script>
<body>
<!-- 网页顶部导航信息 -->
<!--导航条  最上头放置以下内容的黑框-->
<nav class="navbar navbar-inverse navbar-fixed-top">
    <!-- 容器 以下内容为 顶部信息   -->
    <div class="container-fluid">
        <!-- 此段为窗口小化时用’三‘来代替隐藏所有导航信息 -->
        <button type="button" class="navbar-toggle collapsed"
                data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"
                aria-expanded="false">
            <span class="sr-only">Toggle navigation</span> <span
                class="icon-bar"></span> <span class="icon-bar"></span> <span
                class="icon-bar"></span>
        </button>
        <!-- Brand and toggle get grouped for better mobile display -->

        <!-- 头部信息 -->
        <div class="navbar-header">
            <a class="navbar-brand glyphicon glyphicon-globe"
               href="javascript:dialogRedis()" id="menu-toggle"> 购物平台 </a>
        </div>
        <!-- 左边 信息 -->
        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse"
             id="bs-example-navbar-collapse-1">

            <ul class="nav navbar-nav">
                <li class="active "><a href="#"
                                       class="glyphicon glyphicon-shopping-cart">&nbsp我的购物车&nbsp&nbsp <span
                        class="sr-only">(current)</span></a></li>

                <li><a href="#" class="glyphicon ">&nbsp&nbsp首页&nbsp&nbsp&nbsp&nbsp</a></li>
                <li><a href="../xu1/shoucang1" class="glyphicon glyphicon-grain">&nbsp&nbsp收藏夹&nbsp&nbsp&nbsp&nbsp</a></li>


                <!-- 右边的    导航 按钮样式 -->
                <ul class="nav navbar-nav navbar-right">

                    <li><a href="../page/tomain"> &nbsp登录</a></li>
                    <li><a href="../lxx/Register">&nbsp免费注册 </a></li>
                    <li><a href="../lxx/zhuxiao">&nbsp&nbsp 注销</a></li>
                </ul>
            </ul>
        </div>
        <!-- /.navbar-collapse -->
    </div>
    <!-- /.container-fluid -->
</nav>
<input type="hidden" id="productId" th:value="${ordernumber.getProductId()}">
<input type="hidden" id="number" th:value="${ordernumber.getProductCount()}">>

<form id="formId">
    <input type="hidden" name="id" id="id" >
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-body">
                    <div class="form-group">
                        <label for="txt_statu">地址</label>
                        <select class="form-control" id="cmbProvince" name="cmbProvince" ></select>

                        <select class="form-control" id="cmbCity" name="cmbCity" ></select>

                        <select class="form-control" id="cmbArea" name="cmbArea" ></select>
                    </div>
                    <div class="form-group">
                        <label for="txt_statu">详细地址</label>
                        <input type="text" name="particular" class="form-control" id="txt_statu" placeholder="状态">
                    </div>
                    <div class="form-group">
                        <label for="txt_statu">收货人</label>
                        <input type="text" name="consignee" class="form-control" id="txt_statu" placeholder="状态">
                    </div>
                    <div class="form-group">
                        <label for="txt_statu">联系电话</label>
                        <input type="text" name="phone" class="form-control"  id="txt_statu" placeholder="状态">
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" onclick="addressdizhi()" class="btn btn-ok">保存</button>
                    <button type="button" class="btn btn-info" data-dismiss="modal">取消</button>
                </div>
            </div>
        </div>
    </div>
</form>

<div style="margin-right: 10%;margin-left: 10%">
    <b>确认收货地址</b>   <button class="btn btn-group-sm" type="button" onclick="xinzengalert()">新增地址</button>
    <hr style="background-color: black" size="3">
    <!--订单 信息   -->
    <table id="addresstable"></table>
</div>
<br>

<!--查询订购数据-->
<div class="pubWrap" style="margin-left: 10%;margin-right: 10%">
    <div class="pubTitle">
        <!--<h3>确认订单信息</h3>-->
        <div class="confirmRemind"><i class="orderIcon"></i><span>若商品来自不同商家和仓库，将按照仓库最优进行配送</span></div>
    </div>
    <div class="orderTable">
        <div class="tHead">
            <div class="oTd item-1">商品信息</div>
            <div class="oTd item-2">单价</div>
            <div class="oTd item-3">数量</div>
            <div class="oTd item-4">状态</div>
            <div class="oTd item-5">小计</div>
        </div>
        <div id="shopInfos">
            <div class="tBody">
                <div class="shopTitle"><a><i class="orderIcon jxzy"></i><span>酒仙配送</span></a></div>
                <div class="tMain">

                </div></div></div>
    </div>
</div>
<div style="margin-right: 10%;margin-left: 80%">
    <b>实付款：</b>￥<font color="red" size="15px"><span id="money"></span></font>
    <input onclick="jiesuan()" type="button" class="btn btn-group-xs" style="background-color: #d43f3a;size: B5" value="结算">
</div>

<div class="footer">
    <div class="footerTopBox">
        <div class="footerTop">
            <div class="footerContact">
                <i class="publicIcon"></i><b>400-617-9999</b><span>客服热线</span><span>9:00-23:00</span><span>贴心服务</span>
            </div>
            <div class="footerTopRight">
                <div class="ftRight-tit">优惠促销早知道</div>
                <div class="ftRight-form">
                    <input id="subscribe_email" type="text" value="" name=""><span>请输入您的邮箱地址</span><i class="publicIcon" id="subscribe_but"></i>
                </div>
            </div>
        </div>
        <div class="footerServices">
            <ul class="clearfix">
                <li class="servicesItme01">
                    <h3>
                        <i class="publicIcon"></i><span>新手入门</span>
                    </h3>
                    <p>
                        <a href="http://special.jiuxian.com/topic/zpbz/zhengpin.html" target="_blank" rel="nofollow">购物保障</a>
                    </p>
                    <p>
                        <a href="http://help.jiuxian.com/view-1-112.htm" target="_blank" rel="nofollow">服务协议</a>
                    </p>
                    <p>
                        <a href="http://help.jiuxian.com/view-1-113.htm" target="_blank" rel="nofollow">发票说明</a>
                    </p>
                </li>
                <li class="servicesItme02">
                    <h3>
                        <i class="publicIcon"></i><span>常见问题</span>
                    </h3>
                    <p>
                        <a href="http://help.jiuxian.com/view-2-114.htm" target="_blank" rel="nofollow">红包使用</a>
                    </p>
                    <p>
                        <a href="http://help.jiuxian.com/view-2-115.htm" target="_blank" rel="nofollow">返现使用</a>
                    </p>
                    <p>
                        <a href="http://help.jiuxian.com/view-2-116.htm" target="_blank" rel="nofollow">兑换码</a>
                    </p>
                </li>
                <li class="servicesItme03">
                    <h3>
                        <i class="publicIcon"></i><span>配送说明</span>
                    </h3>
                    <p>
                        <a href="http://help.jiuxian.com/view-3-118.htm#delivery_02" target="_blank" rel="nofollow">配送时间</a>
                    </p>
                    <p>
                        <a href="http://help.jiuxian.com/view-3-119.htm#delivery_03" target="_blank" rel="nofollow">配送费用</a>
                    </p>
                    <p>
                        <a href="http://help.jiuxian.com/view-3-117.htm#delivery_01" target="_blank" rel="nofollow">配送范围</a>
                    </p>
                </li>
                <li class="servicesItme04">
                    <h3>
                        <i class="publicIcon"></i><span>支付方式</span>
                    </h3>
                    <p>
                        <a href="http://help.jiuxian.com/view-4-120.htm#pay_1" target="_blank" rel="nofollow">货到付款</a>
                    </p>
                    <p>
                        <a href="#" target="_blank" rel="nofollow">在线支付</a>
                    </p>
                    <p>
                        <a href="http://help.jiuxian.com/view-4-122.htm#pay_3" target="_blank" rel="nofollow">线下支付</a>
                    </p>
                </li>
                <li class="servicesItme05">
                    <h3>
                        <i class="publicIcon"></i><span>售后服务</span>
                    </h3>
                    <p>
                        <a href="http://help.jiuxian.com/view-5-123.htm#bz_1" target="_blank" rel="nofollow">品质保证</a>
                    </p>
                    <p>
                        <a href="http://help.jiuxian.com/view-5-124.htm#bz_2" target="_blank" rel="nofollow">退换货政策</a>
                    </p>
                    <p>
                        <a href="http://help.jiuxian.com/view-5-125.htm#bz_3" target="_blank" rel="nofollow">退换货流程</a>
                    </p>
                </li>
                <li class="servicesItme06">
                    <h3>
                        <i class="publicIcon"></i><span>特色服务</span>
                    </h3>
                    <p>
                        <a href="http://jifen.jiuxian.com/club_index.htm" target="_blank">会员俱乐部</a>
                    </p>
                    <p>
                        <a href="http://member.jiuxian.com/company.htm" target="_blank" rel="nofollow">企业客户</a>
                    </p>
                    <p>
                        <a target="_blank" href="http://forum.jiuxian.com/">酒仙社区</a>
                    </p>
                </li>
                <li class="jxMicroblogging">
                    <div class="item sinaMb">
                        <div class="sinaMbCom clearfix">
                            <a href="http://weibo.com/jiuxianwang?sudaref=www.so.com" target="_blank" rel="nofollow"><i class="publicIcon"></i></a><a href="http://weibo.com/jiuxianwang?sudaref=www.so.com" target="_blank" rel="nofollow">酒仙新浪微博</a>
                        </div>
                    </div>
                    <div class="item weixin">
                        <div class="weixinCon clearfix">
                            <i class="publicIcon"></i><a id="jxWeixin" falg="hide" href="javascript:;" target="_blank" rel="nofollow">酒仙微信</a>
                        </div>
                        <div class="weixinCode" id="weixinCode">
                            <img src="./订单结算-酒仙网_files/weixin-code.jpg">
                        </div>
                    </div>
                </li>
            </ul>
        </div>
    </div>

    <!--页脚-->
    <div class="footerBotBox">
        <div class="footerBot clearfix">
            <div class="footerBotLeft">
                <p class="footerInfo">
                    <a href="#" target="_blank" rel="nofollow">公司简介<i></i></a> <a href="#" target="_blank" rel="nofollow">管理团队<i></i></a>
                    <a href="#" target="_blank" rel="nofollow">媒体报道<i></i></a> <a href="#" target="_blank" rel="nofollow">联系我们<i></i></a>
                    <a href="#" target="_blank">网站地图<i></i></a> <a href="#" target="_blank">品牌大全<i></i></a>
                </p>
                <p class="copyright">
                    北京直购平台网络科技有限公司&nbsp;&nbsp;©&nbsp;&nbsp;直购平台&nbsp;&nbsp;&nbsp;2011&nbsp;&nbsp;shoppingHappy.com&nbsp;&nbsp;All&nbsp;&nbsp;&nbsp;Rights&nbsp;Reserved&nbsp;&nbsp;&nbsp;<a href="javascript:;" target="_blank" rel="nofollow">京ICP备17043395号</a>&nbsp;&nbsp;&nbsp;京公网安备1101050188221
                </p>
                <p class="footerAddr" style="color: #999; line-height: 22px; padding-top: 5px;">
                    <span>统一社会信用代码&nbsp;&nbsp;91110302306646672B&nbsp;&nbsp;&nbsp;商品流通许可证编号&nbsp;&nbsp;JY11131010328793&nbsp;&nbsp;&nbsp;认证时间201910019&nbsp;&nbsp;&nbsp;</span>
                </p>
                <p class="footerAddr" style="color: #999; line-height: 22px; padding-bottom: 7px;">
                    <span>地址：北京市北京经济技术开发区经海五路58号院8幢4层</span>
                </p>
                <p class="footerPro" style="padding: 8px 0 6px;">购买前请确认物流地址是否正确，保证手机号在用，谢谢</p>
            </div>
        </div>
    </div>
</body>
<style type="text/css">
    .footerBotLeft .footerInfo {
        margin-left: -8px;
    }

    .footerBotLeft p {
        font-family: Arial, Helvetica, sans-serif, "宋体";
    }

    .footerBotLeft .footerInfo a {
        color: #666;
    }

    .footerBotLeft .copyright {
        color: #666;
    }
</style>
<script>
    $(function(){
        queryaddress();
        //initDataGrid();
        $.ajax({
            url:'../zsl/chajiaoyi',
            success:function (data) {
                var obj = "";
                var num = 0;
                for(var i=0;i<data.length;i++){
                    id += ","+data[i].productId;
                    num += data[i].orderPrice;
                    obj += "<div class=\"oTr\">\n" +
                        "<div class=\"mainProduct\">\n" +
                        "<div class=\"oTd item-1\">\n" +
                        "<div class=\"img\"><a href=\"http://www.jiuxian.com/goods-84101.html\" target=\"_blank\"><img src=\""+data[i].productImg+"\" width=\"60\" height=\"60\"></a></div>\n" +
                        "<div class=\"name\"><a href=\"http://www.jiuxian.com/goods-84101.html\" target=\"_blank\" style=\"text-align: left;\">"+data[i].productName+"</a><div class=\"promptBox\"><div class=\"unUsed\"><i class=\"orderIcon\"></i><span>此商品不能使用优惠券</span></div></div></div></div>\n" +
                        "<div class=\"oTd item-2\">"+data[i].productPrice+"</div>\n" +
                        "<div class=\"oTd item-3\">x"+data[i].productCount+"</div>\n" +
                        "<div class=\"oTd item-4\">有货</div>\n" +
                        "<div class=\"oTd item-5\">￥"+data[i].orderPrice+"</div></div></div>"
                }
                $(".tMain").html(obj);
                //$("#totalPriceInfo").html("￥"+num);
                $("#money").html(num);
            }
        })
    });
    //收获地址
    queryaddress = function(){
        $("#addresstable").bootstrapTable({
            url: "../zsl/chaaddress",
            method: 'post',
            striped: true,  	// 斑马线效果     默认false
            //只允许选中一行
            singleSelect: false,
            //选中行是不选中复选框或者单选按钮
            clickToSelect: true,
            //showToggle: true,                    //是否显示详细视图和列表视图的切换按钮
            //cardView: false,                    //是否显示详细视图
            uniqueId: "id",                 //每一行的唯一标识，一般为主键列
            //showColumns: true,                  //是否显示所有的列
            // showRefresh: true,                  //是否显示刷新按钮
            minimumCountColumns: 2,     //  最少留两列
            detailView: false,                  //是否显示父子表
            //toolbar: '#tabToolBar',   //  工具定义位置
            sidePagination: 'server',
            toolbar: '#toolbar',
            //pagination: true, //是否展示分页
            pageList: [2, 4, 8, 10],//分页组件
            pageNumber: 1,
            pageSize: 2,//默认每页条数
            //启动回车键做搜索功能
            searchOnEnterKey: true,
            //设置为false 将禁止所有列的排序。
            sortable: true,
            //设置默认排序为 name,直接对应数据库的字段
            sortName: 'id',
            //定义排序方式，'asc' 或者 'desc'。
            sortOrder: "desc",
            //设置为undefined可以获取pageNumber，pageSize，searchText，sortName，sortOrder
            // 设置为limit可以获取limit, offset, search, sort, order
            queryParamsType: 'undefined',
            // 请求服务器数据
            queryParams: function queryParams(params) {
                var param = {
                    pageNumber: params.pageNumber,
                    pageSize: params.pageSize,
                    sortName: params.sortName,
                    sortOrder: params.sortOrder

                };
                return param;
            },
            columns: [
                {field:'cb',checkbox:true},
                //{field: 'id', title: '用户id'},
                {field:'acceptSite',title:'地址'},//  列    field   代表是 后台  传过来的值
                {field:'acceptName',title:'收货人'},
                {field:'acceptPhone',title:'联系电话'},
                {field: 'caozuo', title: '操作',
                    formatter:function(value,row,index){
                        return "<a href='javascript:deleteaddress("+row.id+")' class='btn btn-group-sm'>删除</a>"
                            + "<a href='javascript:xiugai()' class='btn btn-group-sm'>修改</a>";
                    }
                },
            ]
        })
    }
</script>
</html>